<template>
	<view class="ReOrder-group-item">
		<view class="itemHeader">
			<text class="order-no">订单号:{{orderItem.orderNumber}}</text>
			<text class="order-status">待确认收货</text>
		</view>
		<view class="info_center">
			<view class="tupian">
				<img src="../static/IMG6000.jpg" width="105" height="85" />
			</view>
			<view class="info_1">
				<view class="pro_name">
					<text>馆藏精品{{orderItem.orderNumber}}</text>
				</view>
				<view class="seller">
					<text class="f_blue">{{orderItem.sellUserName}}</text>
					<text class="seller_name">卖家</text>
				</view>
				<view class="seller_Code">
					<text>{{orderItem.sellUserInvitationCode}}</text>
				</view>
				<view class="buyer">
					<text class="f_blue">{{orderItem.buyUserName}}</text>
					<text class="buyer_name">买家</text>
				</view>
				<view class="buyer_Code">
					<text>{{orderItem.buyUserInvitationCode}}</text>
				</view>
			</view>
			<view class="price f_red">￥{{orderItem.price}}</view>
		</view>
		<view class="itemFooter">
			<view class="item1">
				<text class="yf_price">运费：￥{{orderItem.shelvesExpenses}}</text>
				<text class="sj_price">上架费：<span class="f_red">￥{{orderItem.shelvesExpenses}}</span></text>
			</view>
			<view class="item1"><text>下单时间：{{orderItem.createTime}}</text></view>
			<view class="item1">
				<text class="yf_price">更新时间：{{orderItem.updateTime}}</text>
				<text class="sj_price">实付：<span class="f_red">￥{{add(orderItem.shelvesExpenses,orderItem.price)}}</span></text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "OrderAll",
		props: {
			order: {
				type: Object,
				required: false,
				default: {
					id: '', //主键自增id
					orderNumber: '', //订单编号
					shopId: '', //商品Id
					storeId: '', //店铺Id
					buyUserId: '', //买家id
					buyUserName: '', //买家名称
					buyUserInvitationCode: '', //买家邀请码
					buyUserPhone: '', //买家手机号码
					sellUserId: '', //卖家id
					sellUserName: '', //卖家名称
					sellUserInvitationCode: '', //卖家邀请码
					sellUserPhone: '', //卖家手机号码
					price: 0, //价格
					createTime: '', //创建时间
					updateTime: '', //更新时间
					shelvesExpenses: 0, //上架费用
					seal: '', //是否已封存，0:未封存，1:已经封存
					sealTime: '', //封存时间
					transition: '', //是否转场,0:未转场,1:已经转场
					transitionTarget: '', //转场目标
					productName: '', //商品名称
					productImg: '', //商品图片链接
					productPrice: '', //商品价格
					orangeOrdersId: '', //原始订单ID
					splitId: '', //是否是拆分订单，0:不是拆分订单,1:是拆分订单
					params: '', //扩展参数
					state: '', //0:待付款，1:待收款，2:待上架，3:待出售,4.已出售
				}
			}
		},
		data() {
			return {
				orderItem: {
					id: '', //主键自增id
					orderNumber: '', //订单编号
					shopId: '', //商品Id
					storeId: '', //店铺Id
					buyUserId: '', //买家id
					buyUserName: '', //买家名称
					buyUserInvitationCode: '', //买家邀请码
					buyUserPhone: '', //买家手机号码
					sellUserId: '', //卖家id
					sellUserName: '', //卖家名称
					sellUserInvitationCode: '', //卖家邀请码
					sellUserPhone: '', //卖家手机号码
					price: 0, //价格
					createTime: '', //创建时间
					updateTime: '', //更新时间
					shelvesExpenses: 0, //上架费用
					seal: '', //是否已封存，0:未封存，1:已经封存
					sealTime: '', //封存时间
					transition: '', //是否转场,0:未转场,1:已经转场
					transitionTarget: '', //转场目标
					productName: '', //商品名称
					productImg: '', //商品图片链接
					productPrice: '', //商品价格
					orangeOrdersId: '', //原始订单ID
					splitId: '', //是否是拆分订单，0:不是拆分订单,1:是拆分订单
					params: '', //扩展参数
					state: '', //0:待付款，1:待收款，2:待上架，3:待出售,4.已出售
				}
			};
		},
		mounted() {
			this.orderItem = this.order
		},
		methods:{
			add(price1,price2){
				return (Number(price1)+Number(price2)).toFixed(2)
			}
		}
	}
</script>

<style>
	.ReOrder-group-item {
		padding: 14px 10px 0 10px;
		background-color: #fff;
		margin-top: 10px;
		display: flex;
		flex-direction: column;
	}

	.ReOrder-group-item .itemHeader {
		align-items: center;
		justify-content: space-between;
		height: 42px;
		border-bottom: 1px solid #eee;
		display: flex;
		flex-direction: row;
	}

	.itemHeader .order-no {
		color: #999;
	}

	.itemHeader .order-status {
		color: #f1553b;
	}

	.itemHeader .order-no text {
		font-size: 12px;
		font-weight: 400;
		line-height: 23px;
	}


	.f_red {
		color: #fc4141;
	}

	.f_blue {
		color: #2866f9;
	}

	.ReOrder-group-item .info_center {
		padding: 10px 0 0 0;
		border-bottom: 1px solid #eee;
		position: relative;
		display: flex;
		flex-direction: row;
	}

	.info_center .info_1 {
		width: 45%;
		justify-content: space-around;
		margin-left: 10px;
		display: flex;
		flex-direction: column;
	}

	.info_center .info_1 .pro_name {
		font-size: 15px;
		font-weight: 400;
		color: #333;
		line-height: 23px;
	}

	.info_center .info_1 .seller_name,
	.info_center .info_1 .buyer_name {
		display: inline-block;
		width: 48px;
		background-color: #ff4144;
		font-size: 13px;
		color: #fff;
		text-align: center;
		border-radius: 9px;
		margin-left: 10px;
		padding: 1px 0;
	}

	.info_center .info_1 .buyer_name {
		background-color: #288F1A;
	}

	.ReOrder-group-item .info_center .price {
		position: absolute;
		right: 5px;
		font-size: 13px;
		font-weight: 400;
		color: #fc4141;
		line-height: 20px;
	}

	.seller_Code text,
	.buyer_Code text {
		color: #999;
	}


	.ReOrder-group-item .itemFooter {
		padding: 10px 0;
		display: flex;
		flex-direction: column;
	}

	.ReOrder-group-item .itemFooter .item1 {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}

	.ReOrder-group-item .itemFooter .item1 text {
		font-size: 13px;
		font-weight: 400;
		color: #999;
		line-height: 21px;
	}


	.f_right {
		font-size: 14px;
		font-weight: 400;
		color: #999;
		line-height: 21px;
	}
</style>